<template>
  <div class="ApproveIconImage">
    <img
        v-if="props.id"
        style="height:100% "
        :src="src"
    >
  </div>
</template>
<script setup name="ApproveIconImage">
const props = defineProps({
  id: {
    type: [String, Number],
    default: ""
  }
})
const iconList = ref(
    Object.entries(import.meta.glob('./approverIcon/*.png',
        {eager: true}))
        .sort((a,
               b) => {
          return Number(a[0].match(new RegExp(/\d+/,'ig')) - b[0].match(new RegExp(/\d+/,'ig')))
        }) .map(([path, module],
              idx) => ({
          src: module.default,
          id: idx,
        }))
)
const getIconSrc = (flowImg) => {
  try {
    let num = 12
    if (flowImg) {
      num = flowImg
    }
    return iconList.value.filter((res) => {
      return res.id == num
    })[0].src
  } catch (e) {
    return ''
  }
}
const src = ref(getIconSrc(props.id))
</script>
<style scoped lang="scss">
.ApproveIconImage {
}
</style>
